<%--
  Created by IntelliJ IDEA.
  User: WheelChen
  Date: 2017/4/9
  Time: 22:00
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" isELIgnored="false" %>
<html>
<head>
    <meta charset="UTF-8">
    <title>公司信息</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" type="text/css" href="/static/common/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/static/css/global.css">
    <link rel="stylesheet" href="/static/css/enterprise/companyInfo.css">
</head>
<body>
<div class="admin-main">
    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
        <legend>公司信息</legend>
    </fieldset>
    <form class="layui-form" action="" method="post" style="width: 400px">
        <div id="content">
            <div class="layui-form-item">
                <label class="layui-form-label">公司全称</label>
                <div class="layui-input-block">
                    <input name="realname" type="text" v-model="orginfo.fullname" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">公司简称</label>
                <div class="layui-input-block">
                    <input name="shortname" type="text" class="layui-input" v-model="orginfo.shortname">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">地址</label>
                <div class="layui-input-block">
                    <input name="addr" class="layui-input" v-model="orginfo.addr">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">联系人</label>
                <div class="layui-input-block">
                    <input name="contactor" class="layui-input"
                           v-model="orginfo.contactor">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">联系电话</label>
                <div class="layui-input-block">
                    <input name="phone" class="layui-input" v-model="orginfo.phone">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">网址</label>
                <div class="layui-input-block">
                    <input name="url" class="layui-input" v-model="orginfo.url">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">经度</label>
                <div class="layui-input-inline">
                    <input name="longtitude" class="layui-input"
                           v-model="orginfo.longtitude">
                </div>
                <label class="layui-form-label">纬度</label>
                <div class="layui-input-inline">
                    <input name="latitude" class="layui-input"
                           v-model="orginfo.latitude">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">状态</label>
                <div class="layui-input-block">
                    <div v-if="orginfo.state == 1">
                        <input name="state" class="layui-input disabled" value="暂存" readonly>
                    </div>
                    <div v-else-if="orginfo.state == 2">
                        <input name="state" class="layui-input disabled" value="审核中" readonly>
                    </div>
                    <div v-else-if="orginfo.state == 3">
                        <input name="state" class="layui-input disabled" value="审核通过" readonly>
                    </div>
                    <div v-else-if="orginfo.state == 4">
                        <input name="state" class="layui-input disabled" value="审核不通过" readonly>
                    </div>
                    <div v-else>
                        <input name="state" class="layui-input disabled" value="暂存" readonly>
                    </div>
                </div>
            </div>
        </div>
        <%--Todo 上传按钮样式切换--%>
        <%--营业执照上传--%>
        <div class="layui-form-item">
            <label class="layui-form-label">营业执照照片</label>
            <div class="layui-input-block">
                <img id="business" style="height: 100px;width: 100px">
                <input type="file" name="fileUp" id="businessliscense" class="layui-upload-file disabled_btn">
            </div>
        </div>
        <%--单位外景上传--%>
        <div class="layui-form-item">
            <label class="layui-form-label">单位外景照片</label>
            <div class="layui-input-block">
                <img id="out" style="height: 100px;width: 100px">
                <input type="file" name="fileUp" id="outsidepic" class="layui-upload-file">
            </div>
        </div>
        <div id="button" v-cloak>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <div v-show="show">
                        <%--审核中则不显示修改按钮--%>
                        <div v-if="isEdit">
                            <button type="button" name="edit" class="layui-btn" @click="edit">修改</button>
                        </div>
                    </div>
                    <div v-show="!show">
                        <button type="button" class="layui-btn" @click="save" lay-submit>保存</button>
                        <button type="button" class="layui-btn layui-btn-primary" @click="reload">返回</button>
                    </div>
                </div>
            </div>
        </div>
    </form>
    <div id="bdMap" style="width: 300px;height: 300px;float: right;position: relative;left: -20%;top: -600px;"></div>
</div>


<script>var userId =${sessionScope.currentUser.getId()};</script>
<script type="text/javascript" src="../../static/common/layui/layui.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=8K08Q6AWX7LcrskmDiE6BFSG5LqUfGGE"></script>
<script src="../../static/common/vue.min.js"></script>
<script src="../../static/common/axios.min.js"></script>
<script type="text/javascript">
    var map = new BMap.Map("bdMap"); //创建地图实例
    layui.use(['form', 'upload', 'jquery', 'layer'], function () {
        var form = layui.form(),
            $ = layui.jquery,
            layer = layui.layer,
            image = {}; // 图片对象

        //营业执照
        layui.upload({
            url: '/upload/businessliscense',
            elem: '#businessliscense',
            success: function (response) {
                image.path = response.data;
                image.description = "营业执照";
                image.isencrypted = 1;//需要加密
                axios.post("/image/add", image)
                    .then(function (response) {
                        console.log(response.data);
                        data.orginfo.businessliscense = response.data.data;
                        axios.get("/image/find/" + response.data.data)
                            .then(function (response) {
                                console.log(response.data);
                                $('#business').attr('src', response.data.data);
                            })
                            .catch(function (response) {
                                console.log(response);
                            });
                    })
                    .catch(function (response) {
                        console.log(response);
                    })

            },
            before: function () {
                console.log('营业执照上传中');
            }
        });
        //单位外景
        layui.upload({
            url: '/upload/out',
            elem: '#outsidepic',
            success: function (response) {
                $('#out').attr('src', response.data);
                console.log(response.data);
                image.path = response.data;
                image.description = "单位外景";
                image.isencrypted = 2;//不需要加密
                axios.post("/image/add", image)
                    .then(function (response) {
                        console.log(response.data);
                        data.orginfo.outsidepic = response.data.data;
                    })
                    .catch(function (response) {
                        console.log(response);
                    });
            },
            before: function () {
                console.log('outsidepic文件上传中');
            }
        });
        //除文件上除按钮的绑定
        var data = new Vue({
            el: '#content'
            , data: {
                orginfo: {
                    managerid: userId
                }
            }
        });
        //action
        var bt = new Vue({
            el: '#button',
            data: {
                show: true,
                isEdit: true //是否可修改
            },
            methods: {
                /**
                 * 显示可编辑页面
                 */
                edit: function () {
                    bt.show = false;
                    $('form input[name!=state]').attr("readOnly", false).removeClass("disabled");
                    $('form input[type=file]').attr("disabled", false).removeClass("disabled");
                },
                /**
                 * 保存修改信息
                 */
                save: function () {
                    $('form input[name!=state]').attr("readOnly", true).addClass("disabled");
                    $('form input[type=file]').attr("disabled", true).addClass("disabled");
                    console.log(data.orginfo);
                    layer.confirm('是否确认保存，保存后需审核', {
                        offset: '150px'
                    }, function (index) {
                        bt.show = true;
                        data.orginfo.state = 2; //发起审核
                        //基本信息
                        axios.post('/orginfo/modifyOrAddByManagerId', data.orginfo)
                            .then(function (Response) {
                                layer.msg(Response.data.message);
//                                //创建点
//                                var point = new BMap.Point(data.orginfo.longtitude, data.orginfo.latitude);
//                                //移动中心点位置
//                                map.panTo(point);
//                                //创建标注
//                                var marker = new BMap.Marker(point);
//                                //清除所有标注
//                                map.clearOverlays();
//                                //添加标注
//                                map.addOverlay(marker);
                            })
                            .catch(function (Response) {
                                layer.msg(Response.data.message);
                            });

                        layer.close(index);
                        location.reload();
                    });

                },
                /**
                 * 返回显示页面
                 */
                reload: function () {
                    bt.show = true;
                    $('#content input[name!=state]').attr("readOnly", true).addClass("disabled");
                    $('form input[type=file]').attr("disabled", true).addClass("disabled");
                },
                /**
                 * 获取公司信息
                 */
                getInfo: function () {
                    axios.get('/orginfo/findByManagerId/' + userId)
                        .then(function (Response) {
                            console.log(Response.data);
                            $('#content input[name!=state]').attr("readOnly", true).addClass("disabled");
                            if (Response.data.data !== null)
                                if (Response.data.data.orgInfo !== null) {
                                    data.orginfo = Response.data.data.orgInfo;
                                    if (data.orginfo.state == 2) {
                                        bt.isEdit = false;
                                        layer.ready(function () {
                                            layer.msg('信息审核中 无法修改');
                                        });
                                    }
                                    else if (data.orginfo.state == 4) {
                                        layer.ready(function () {
                                            layer.msg('公司信息审核不通过 请修改');
                                        });
                                    }
                                    //改变图片显示
                                    if (Response.data.data.businessliscense !== null)
                                        $('#business').attr('src', Response.data.data.businessliscense.path);
                                    if (Response.data.data.outsidepic !== null)
                                        $('#out').attr('src', Response.data.data.outsidepic.path);
                                }
                                    //创建地图点坐标
                                    var point = new BMap.Point(data.orginfo.longtitude, data.orginfo.latitude);
                                    //设置地图中心点和地图级别
                                    map.centerAndZoom(point, 15);
                                    //设置标注
                                    var marker = new BMap.Marker(point);
                                    //清除所有标注
                                    map.clearOverlays();
                                    //添加标注
                                    map.addOverlay(marker);
                                    //启用鼠标滚轮放大缩小
                                    map.enableScrollWheelZoom(true);

                        })
                        .catch(function (Response) {
                            console.log("失败");
                            console.log(Response);
                        });
                }
            }

        });

        //首次获取信息
        bt.getInfo();
    });
</script>
</body>
</html>
